$(function(){
    // 轮播图
    //设置变量速度为3秒
    var speed = 3000;
    //循环变量为1，是避免定时器再等第一张图片
    var m = 1;
    //设置定时器的函数和时间
    var playTimer = setInterval(runPlay,speed);
    //定时函数
    function runPlay(){
        //判读如果m大于4，就设置m=0
        if(m>4){
            m=0;
        }
        //调用controlPlay函数来控制图片变化
        controlPlay(m);
        m++;
    }
    //通过参数控制图片的变化,图标变化
    function controlPlay(n){
        $("#imgList a").removeClass("current").eq(n).addClass("current");
        $("ul li").removeClass("current").eq(n).addClass("current");
    }
    //给整个轮播图绑定鼠标事件，当鼠标放到轮播图上停止轮播图，当鼠标离开轮播图继续滚动
    $("#playBox").mouseenter(function(){
        //停止定时
        clearInterval(playTimer);
        //左右控制按钮显示
        // $(".sliderbar").fadeIn(300);
        $(".sliderbar").fadeIn("slow");
    }).mouseleave(function(){
        //重新开始定时
        playTimer =setInterval(runPlay,speed);
        //左右控制按钮隐藏
        // $(".sliderbar").fadeOut(300);
        $(".sliderbar").fadeOut("slow");
    });
    //给li绑定控制图标绑定单击事件
    $("ul li").click(function(){
        controlPlay($(this).index());
        //鼠标点击过后修改m的值
        m =$(this).index()+1;
    }).hover(function(){
        //给li取消鼠标悬停的冒泡
        return false;
    })
    //给左右的控制图标取消 鼠标悬停的冒泡
    $(".sliderbar").hover(function(){
        return false;
    })
    //下一张图片
    $(".slidebar-right").click(function(){
        //判断m的值
        if(m>4){
            m=0;
        }
        //显示下一站图片
        controlPlay(m);
        m ++;
    })
    //上一张图片
    $(".slidebar-left").click(function(){
        //m默认显示下一张，所以为了显示上一张，m必须减2
        m -= 2;
        if(m<0){
            m=4;
        }
        //显示上一张图片
        controlPlay(m);
        //保证m要显示下一张
        m++;
    }) 
    

    // 搜索框
    // $(document).on('click','#search',function(){
    $("#search").on('click',function(){
        // console.log(1);
        //页面层
        layer.open({
            type: 1,
            skin: 'layui-layer-rim', //加上边框
            area: ['420px', '240px'], //宽高
            content: '啥也没有'
        });
    });
    // // 弹窗
    // $(document).on('click','#lists',function(){
    //     layer.tab({
    //         area: ['600px', '300px'],
    //         tab: [{
    //           title: 'TAB1', 
    //           content: '内容1'
    //         }, {
    //           title: 'TAB2', 
    //           content: '内容2'
    //         }, {
    //           title: 'TAB3', 
    //           content: '内容3'
    //         }]
    //     });
    // });

    // 设置的显示隐藏
    //给li注册鼠标经过事件，让自己的ul显示出来
    $("#install").mouseenter(function () {
      //找到所有的儿子，并且还得是ul
      $(this).children("#icons").show();
    //   $(this).children("#icons").slideUp(800);
    });
    $("#install").mouseleave(function () {
      $(this).children("#icons").hide();
    //   $(this).children("#icons").hide().slideDown(800);
    });

    // ReadMore部分
    $(".post").each(function(index,element){
        if(index>4){
            $(".post").eq(index).css("display","none");
        }
        // console.log(index);
    })
    $("#readmore").on('click',function(){
        $(".post").each(function(indexs,element){
            // console.log(indexs);
            if(indexs){
                console.log(indexs);
                $(".post").eq(indexs).css("display","block");
            }
            console.log(indexs);
        })
        $("#readmore").html("END")
    });

    // 回到顶部
    $("#pointup").click(function(){
        $("html,body").animate({  
            scrollTop:0 
        },1200);
    })
    // 回到底部
    $("#pointdown").click(function(){
        $("html,body").animate({  
            scrollTop:5516
        },1200);
    })
    // 白天模式
    $("#sunstyle").click(function(){
      $("body").css("background-color","#fff");
    })
    // 夜晚模式
    $("#noonstyle").click(function(){
      $("body").css("background-color","#555");

        

    })
})











//tab层
// layer.tab({
//     area: ['600px', '300px'],
//     tab: [{
//       title: 'TAB1', 
//       content: '内容1'
//     }, {
//       title: 'TAB2', 
//       content: '内容2'
//     }, {
//       title: 'TAB3', 
//       content: '内容3'
//     }]
// });

//提示层
// layer.msg('一段提示信息');